<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <link rel="stylesheet" type="text/css" href="css/index.css">
	<script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>
	<script type="text/javascript"><!--
		$(document).ready(function() {
			$('li').click(function() {
				$('li.selected').removeClass("selected");
				$(this).addClass("selected");
			})
			
		})
	</script>
<style type ="text/css">
* {
	margin: 0;
	padding: 0;
}

#menu {
	width: 950px;
	height: 30px;
	background-color: white;
	color: gray;
	font-family: Arial;
	font-size: 20px;
	margin: 20px auto auto auto;
}

#menu ul {
	list-style-type: none;
	display: block;
}

#menuBar {
	padding-left: 20px;
}

#menuBar li {
	float: left;
	padding: 15px 0;
	height: 16px;
	display: inline;
	width: 80px;
	border-right: 1px solid #ccc;
	position: relative;
	word-wrap: break-word;
	word-break: normal;
}

</style>
  </head>
  <%
  String menu = (String)request.getAttribute("MENU_INDEX");
%>
  <body>
    <div id="menu">
	    <ul id="menuBar">
	      <li id="a1" <%="index".equals(menu)?" class=\"selected\"":""%>><a id="index" href="index.do" >首页</a></li>
	      <li id="a2" <%="info".equals(menu)?" class=\"selected\"":""%>><a id="info" href="info.do" >资讯</a></li>
	      <li id="a3"><a href="#">精华</a></li>
	      <li id="a4"><a href="#">论坛</a></li>
	      <li id="a6"><a href="#">问答</a></li>
	    </ul>
 	</div>
  </body>
</html>
